<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>Mock管理系统</title>
<link rel="icon" href="favicon.ico" type="image/ico">
<meta name="keywords" content="Mock管理系统">
<meta name="description" content="Mock管理系统">
<meta name="author" content="yinqi">
<link href="static/css/bootstrap.min.css"  th:href="@{/system/static/css/bootstrap.min.css}"  rel="stylesheet">
<link href="static/css/materialdesignicons.min.css" th:href="@{/system/static/css/materialdesignicons.min.css}" rel="stylesheet">
<link href="static/css/style.min.css" th:href="@{/system/static/css/style.min.css}" rel="stylesheet">
<link href="static/css/table.css" th:href="@{/system/static/css/table.css}" rel="stylesheet">
</head>
<body>
<div class="lyear-layout-web">
  <div class="lyear-layout-container">
    <!--左侧导航-->
    <aside class="lyear-layout-sidebar">
       
      <!-- logo -->
      <div id="logo" class="sidebar-header">
        <a href="../index.html"><img src="../static/images/mock.png" title="LightYear" alt="LightYear" /></a>
      </div>
      <div class="lyear-layout-sidebar-scroll">
        
        <nav class="sidebar-main">
          <ul class="nav nav-drawer">
            <li class="nav-item"> <a href="../index.html"><i class="mdi mdi-home"></i> 后台首页</a> </li>
            <li class="nav-item nav-item-has-subnav active open">
              <a href="javascript:void(0)"><i class="mdi mdi-palette"></i>Mock配置</a>
              <ul class="nav nav-subnav">
                <li class="active"> <a href="mockList">mock列表</a> </li>
                <li> <a href="mockLog">mock请求日志</a> </li>
              </ul>
            </li> 
            <li class="nav-item nav-item-has-subnav">
              <a href="javascript:void(0)"><i class="mdi mdi-settings"></i>基础管理</a>
              <ul class="nav nav-subnav">
                <li> <a href="../user/userList">用户管理</a> </li>  
                <li> <a href="../category/categoryList">模块管理</a> </li>            
              </ul>
            </li>            
          </ul>
        </nav>
      </div>
      
    </aside>
    <!--End 左侧导航-->
    
    <!--头部信息-->
    <header class="lyear-layout-header">
      
      <nav class="navbar navbar-default">
        <div class="topbar">
          
          <div class="topbar-left">
            <div class="lyear-aside-toggler">
              <span class="lyear-toggler-bar"></span>
              <span class="lyear-toggler-bar"></span>
              <span class="lyear-toggler-bar"></span>
            </div>
            <span class="navbar-page-title"> Mock配置 - mock列表 </span>
          </div>
          
          <ul class="topbar-right">
            <li class="dropdown dropdown-profile">
              <a href="javascript:void(0)" data-toggle="dropdown">
                <input id="userType" type="hidden" th:value="${session.userType}" /> 
              	<input id="userId" type="hidden" th:value="${session.userId}" />             		
                <span style="font-size:18px" th:text="${session.userName}"></span>
                <span class="caret"></span>
              </a>
              <ul class="dropdown-menu dropdown-menu-right">
                <li> <a  data-toggle="modal" data-target="#personalModal"  onclick="editPer();"><i class="mdi mdi-account"></i> 个人信息</a> </li>
				<li> <a data-toggle="modal" data-target="#editPassWdModal" data-whatever="@mdo"><i class="mdi mdi-lock-outline"></i> 修改密码</a> </li>
                <li class="divider"></li>
                <li> 
                	<a  onclick="Loginout()" ><i class="mdi mdi-logout-variant"></i>退出登录</a>
                </li>
              </ul>
            </li>            
          </ul>
          
        </div>
      </nav>
      
    </header>
    <!--End 头部信息-->
    
    <!--页面主要内容-->
    <main class="lyear-layout-content">     
     
     <div class="container-fluid">
     	 <div class="row">
     	 	 <div class="col-lg-12">
	     	 	 	<div class="card">
	     	 	 		<form  class="form-inline">
								<div class="card-toolbar clearfix">									
										<div class="form-group col-md-2">
											<label class="control-label">名称： </label>
											<input class="form-control" type="text" id="keyword"   value="" name="keyword" style="width:65%;" placeholder="请输入名称">
<!-- 											<div class="input-group-btn">名称</div> -->
<!-- 											<input type="text" id="keyword" class="form-control" value="" name="keyword" placeholder="请输入名称"> -->
										</div>
										<div class="form-group col-md-2">
	                        				<label class="control-label">模块名称：</label>
							                <select class="form-control" id="hf-search-category" name="hf-search-category" >
							                     <option value="-1">全部</option>	
							                </select>
					                    </div>
									
									<div class="toolbar-btn-action">
										<a class="btn btn-success m-r-5" onclick="mocklist()"><i class="mdi mdi-search-web"></i> 搜索</a> 
<!-- 										<a class="btn btn-primary m-r-5" href="add"><i class="mdi mdi-plus"></i> 新增</a> -->
											<button type="button" class="btn btn-primary m-r-5" data-toggle="modal" data-target="#addModal" data-whatever="@mdo" onclick="clearModel()"><i class="mdi mdi-plus"></i>新增</button>
									</div>
								</div>
							</form>
								<div class="card-body">
	     	 	 		 	<div class="table-responsive">
	     	 	 		 		<table class="table table-bordered" id="table-container">
	     	 	 		 			<thead>
				                      <tr>
				                        <th>名称</th>
				                        <th>URL路径</th>
<!-- 				                        <th style="width: 100px;">返回状态码</th> -->
<!-- 				                        <th>响应内容</th> -->
				                        <th>描述</th>
				                        <th>创建时间</th>
				                        <th>操作</th>
				                      </tr>
				                    </thead>
				                    <tbody id="group_one">
				                    </tbody>				                    
	     	 	 		 		</table>
	     	 	 		 		<div id="count" class='col-md-4'>	     	 	 		 			     	 	 		 			
	     	 	 		 		</div>
	     	 	 		 		<ul id="pages"></ul>
	     	 	 		 	</div>
	     	 	 		 </div>
	     	 	 	</div>

     	 	 </div>     	 	 
     	 </div>
     </div>         
    
    	<footer class="home-footer">
		    <div style="text-align:center">
		      <span class="copy"  style="color:red;">2020 &copy; Luojuwang</span>
		    </div>
		</footer>
    </main>        
    <div   id="response" ></div>
    
    <div class="modal fade" id="addModal" tabindex="-1" role="dialog"  aria-labelledby="addModalLabel">
	    <div class="modal-dialog" role="document">
	        <form class="form-horizontal" >
	            <div class="modal-content">
	                <!-- 弹出框的头部 -->
	                <div class="modal-header">
	                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
	                        <span aria-hidden="true">
	                            &times;
	                        </span>
	                    </button>
	                    <h4 class="modal-title" id="addModalLabel">新增Mock请求<span style="color:Red;">(红色为必填项)</span></h4>
	                </div>
	                <!-- 弹出框的内容 -->
	                <div class="modal-body">
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-name" style="color:Red;">名称</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-name" name="hf-name" placeholder="请输入...">
	                        </div>
	                    </div>
	                   	<div class="form-group" >
	                        <label class="col-md-2 control-label" for="hf-category" style="color:Red;">模块名称</label>
	                        <div class="col-md-9" style="display:flex;">
			                      <select class="form-control" id="hf-category" name="hf-category" style="width:30%;">			                      			                      
			                      </select>
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-url" style="color:Red;">URL路径</label>
	                        <span style="color: red;font-weight: 700;">※ URL路径以/开始，传参请用占位符{path}占位,例如：/test/{path}</span>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-url" name="hf-url" placeholder="请输入...">
	                        </div>
	                    </div>
<!-- 	                    <div class="form-group"> -->
<!-- 	                        <label class="col-md-2 control-label" for="hf-statusCode">返回状态码</label> -->
<!-- 	                        <div class="col-md-9"> -->
<!-- 	                            <input class="form-control" type="text" id="hf-statusCode" name="hf-statusCode" -->
<!-- 	                            placeholder="请输入..."> -->
<!-- 	                        </div> -->
<!-- 	                    </div> -->

	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-description">描述</label>
	                        <div class="col-md-9">
	                            <textarea class="form-control"  maxlength="255" id="hf-description"
	                            name="hf-description" style="height: 150px;resize: none;" placeholder="请输入...">
	                            </textarea>
	                        </div>
	                    </div>
	                </div>

	                <!-- 弹出框的底部 -->
	                <div class="modal-footer">
	                    <div style="text-align:center">
	                        <!-- 设置了data-dismiss="modal"属性，就可以关闭该弹出框 -->
	                        <button type="button" class="btn btn-primary" onclick="save()"> 保存</button>
	                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
	                    </div>
	                </div>
	                						
	            </div>
	        </form>
	    </div>
	</div> 
						
	<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel">
	    <div class="modal-dialog" role="document">
	        <form class="form-horizontal" action="#" method="post" onsubmit="return false;">
	            <div class="modal-content">
	                <!-- 弹出框的头部 -->
	                <div class="modal-header">
	                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
	                        <span aria-hidden="true"> &times; </span>
	                    </button>
	                    <h4 class="modal-title" id="editModalLabel">编辑Mock请求<span style="color:Red;">(红色为必填项)</span></h4>
	                </div>
	                <!-- 弹出框的内容 -->
	                <div class="modal-body">
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-edit-name" style="color:Red;">名称</label>
	                        <div class="col-md-9">
	                        	<input class="form-control" type="hidden" id="hf-edit-id" name="hf-edit-id" value="">
	                            <input class="form-control" type="text" id="hf-edit-name" name="hf-edit-name" readonly="readonly" value="" placeholder="请输入...">
	                        </div>
	                    </div>
	                    <div class="form-group" >
	                        <label class="col-md-2 control-label" for="hf-edit-category" style="color:Red;">模块名称</label>
	                        <div class="col-md-9" style="display:flex;">
			                      <select class="form-control" id="hf-edit-category" name="hf-edit-category" style="width:30%;">
			                      </select>
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-url" style="color:Red;">URL路径</label>
	                        <span style="color: red;font-weight: 700;">※ URL路径以/开始，传参请用占位符{path}占位,例如：/test/{path}</span>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-edit-url" readonly="readonly" name="hf-edit-url" value="" placeholder="请输入...">
	                        </div>
	                    </div>
<!-- 	                    <div class="form-group"> -->
<!-- 	                        <label class="col-md-2 control-label" for="hf-statusCode">返回状态码</label> -->
<!-- 	                        <div class="col-md-9"> -->
<!-- 	                            <input class="form-control" type="text" id="hf-statusCode" name="hf-statusCode" value="" placeholder="请输入..."> -->
<!-- 	                        </div> -->
<!-- 	                    </div> -->
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-description">描述</label>
	                        <div class="col-md-9">
	                            <textarea class="form-control"  maxlength="255" id="hf-edit-description"  name="hf-edit-description" style="height: 150px;resize: none;" placeholder="请输入...">
	                            </textarea>
	                        </div>
	                    </div>
	                </div>
	                <!-- 弹出框的底部 -->
	                <div class="modal-footer">
	                    <div style="text-align:center">
	                        <!-- 设置了data-dismiss="modal"属性，就可以关闭该弹出框 -->
	                        <button type="button" class="btn btn-primary" onclick="editAction()"> 保存</button>
	                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
	                    </div>
	                </div>
	            </div>
	        </form>
	    </div>
	</div>
	<!--个人信息-->
	<div class="modal fade" id="personalModal" tabindex="-1" role="dialog" aria-labelledby="personalModalLabel">
	    <div class="modal-dialog" role="document">
	        <form class="form-horizontal" action="#" method="post" onsubmit="return false;">
	            <div class="modal-content">
	                <!-- 弹出框的头部 -->
	                <div class="modal-header">
	                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
	                        <span aria-hidden="true"> &times; </span>
	                    </button>
	                    <h4 class="modal-title" id="editUserModalLabel">个人信息</h4>
	                </div>
	                <!-- 弹出框的内容 -->
	                <div class="modal-body">
	                    <input class="form-control" type="hidden" id="hf-per-userId" name="hf-userId" value="">
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-per-loginName">登陆名称</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-per-loginName" name="hf-per-loginName" value="" readonly="readonly">
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-per-userName">用户名称</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-per-userName" name="hf-per-userName" value="" placeholder="请输入...">
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-per-email">邮箱</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-per-email" name="hf-per-email" value="" placeholder="请输入...">
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-per-phone">手机</label>
	                        <div class="col-md-9">
	                            <input class="form-control"  id="hf-per-phone" name="hf-per-phone"   placeholder="请输入..."/>	                            
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-per-sex">性别</label>
	                        <div class="col-md-9">
								<label class="radio-inline" for="example-inline-radio">
			                        <input type="radio" id="hf-per-sex-radio" name="hf-per-sex-radio" value="0">
			                        	男
			                     </label>
			                     <label class="radio-inline" for="example-inline-radio">
			                       <input type="radio" id="hf-per-sex-radio" name="hf-per-sex-radio" value="1">
			                        	女
			                     </label>
                        	</div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-per-remark">备注</label>
	                        <div class="col-md-9">
	                            <textarea class="form-control"  maxlength="255" id="hf-per-remark"  name="hf-per-remark" style="height: 150px;resize: none;" placeholder="请输入...">
	                            </textarea>
	                        </div>
	                    </div>
	                </div>
	                <!-- 弹出框的底部 -->
	                <div class="modal-footer">
	                    <div style="text-align:center">
	                        <!-- 设置了data-dismiss="modal"属性，就可以关闭该弹出框 -->
	                        <button type="button" class="btn btn-primary" onclick="editPersonalAction()"> 保存</button>
	                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
	                    </div>
	                </div>
	            </div>
	        </form>
	    </div>
	</div>
	<!--修改密码--> 
	<div class="modal fade" id="editPassWdModal" tabindex="-1" role="dialog" aria-labelledby="editPassWdModalLabel">
	    <div class="modal-dialog" role="document">
	        <form class="form-horizontal" action="#" method="post" onsubmit="return false;">
	            <div class="modal-content">
	                <!-- 弹出框的内容 -->
	                <div class="modal-body">
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-old-pwd">旧密码</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-old-pwd" name="hf-old-pwd" value="" placeholder="请输入...">
	                        </div>
	                    </div>
						<div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-new-pwd">新密码</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-new-pwd" name="hf-new-pwd" value="" placeholder="请输入...">
	                        </div>
	                    </div>
	                    <div class="form-group">
	                        <label class="col-md-2 control-label" for="hf-confirm-pwd">确认密码</label>
	                        <div class="col-md-9">
	                            <input class="form-control" type="text" id="hf-confirm-pwd" name="hf-confirm-pwd" value="" placeholder="请输入...">
	                        </div>
	                    </div>

	                <!-- 弹出框的底部 -->
	                <div class="modal-footer">
	                    <div style="text-align:center">
	                        <!-- 设置了data-dismiss="modal"属性，就可以关闭该弹出框 -->
	                        <button type="button" class="btn btn-primary" onclick="editPWD()"> 保存</button>
	                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
	                    </div>
	                </div>
	            </div>
	           </div>
	        </form>
	    </div>
	</div>
	</div>
    <!--End 页面主要内容-->    
  </div>

<script type="text/javascript" src="../static/js/jquery.min.js" th:href="@{/system/static/js/jquery.min.js}"></script>
<script type="text/javascript" src="../static/js/bootstrap.min.js" th:href="@{/system/static/js/bootstrap.min.js}"></script>
<script type="text/javascript" src="../static/js/bootstrap-paginator.js" th:href="@{/system/static/js/bootstrap-paginator.js}"></script>
<script type="text/javascript" src="../static/js/perfect-scrollbar.min.js" th:href="@{/system/static/js/perfect-scrollbar.min.js}"></script>
<script type="text/javascript" src="../static/js/main.min.js" th:href="@{/system/static/js/main.min.js}"></script>
<script type="text/javascript" src="../static/js/mock/mockurl.js" th:href="@{/system/static/js/mock/mockurl.js}"></script>
<script type="text/javascript" src="../static/js/mock/login.js" th:href="@{/static/system/js/mock/login.js}"></script>
<script type="text/javascript" src="../static/js/mock/tab.js" th:href="@{/static/system/js/mock/tab.js}"></script>
<script type="text/javascript" src="../static/js/mock/person.js" th:href="@{/system/static/js/mock/person.js}"></script>
<script type="text/javascript">
$(window).load( function(){
	initData("",-1);
	categorylist();
} );

function mocklist() {
	var txt=$("#keyword").val().trim();
	var categoryId=$("#hf-search-category").val();
	initData(txt,categoryId);
}
function clearModel(){
	$("#addModal input#hf-name").val("");
	$("#addModal select#hf-category").val("1");
	$("#addModal input#hf-url").val("");
	$("#addModal textarea#hf-description").val("");
}
function cleareditModel(){
	$("#editModal input#hf-name").val("");
	$("#editModal select#hf-edit-category").val("1");	
	$("#editModal input#hf-url").val("");	
	$("#editModal textarea#hf-description").val("");
}
//引入其它html内容
$("#response").load("/Mock/system/mockresp/index.html");	
</script>
</body>
</html>
